import React, {Component} from 'react';

// import qs from 'querystring'

class Detail extends Component {
  render() {
    console.log(this.props)
    // params参数存在于match.params
    // const {id, title} = this.props.match.params;

    // search传参存在于location.search, "?aa=xx&bb=?" 要去掉?
    // const data = qs.decode(this.props.location.search.slice(1))
    // const {id, title} = data;

    // state传参存在于location.state
    const {id, title} = this.props.location.state
    /*
    state传参时，如果使用HashRouter，报警告每次push的path相同，不会添加到historyStack中(state不更新). 建议搭配BrowserRouter使用
    刷新页面时，因为HashRouter没有history的记录，因此state为undefined
    但是使用BrowserRouter，单纯的刷新不会影响state，但是如果清空缓存和历史纪录，state会为undefined
     */
    return (
      <ul>
        <li>ID:{id}</li>
        <li>Title:{title}</li>
        <li>Content:hello {title}</li>
      </ul>
    );
  }
}

export default Detail;
